import {
  createInbizSchema,
  createReactiveBaseSchema,
  createComponentStyleSchema,
  createDecoratorStyleSchema,
  createBizStyleSchema,
  createEmptySchema,
  createControllerSchema
} from '@inbiz/setters';
import { createBehavior, createResource } from '@inbiz/core';
import indexIibraryConfig from './components';
import { SearchResultEngine as LocaleSearchResultEngine, plugin as pluginLocale } from './locale';
import { crateFileAndfolderLibrary } from './components/utils';
/**
 * 1.属性的默认值:defaultProps
 * 2.属性的json数据
 * */
export const defaultProps = {
  headerStyle: {
    icon: { type: 'icon-sousuojieguo', size: 32 },
  },
  style: {
    padding: '0px 20px 0 20px',
  },
  displayRule: '2',
  pageNumber: '20',
  similarSearch: true, // 相似搜索
  indexIibraryConfig: crateFileAndfolderLibrary(), // 索引库配置
  searchEngineComponent: '' as string | undefined, // 关联搜索入口， 点击相似词是需要
  showBack: false,
};

export const propsSchema = createInbizSchema({
  attribute: {
    ...createReactiveBaseSchema({
      pageNumber: {
        type: 'string',
        enum: ['10', '20', '50', '100'],
        'x-decorator': 'FormItem',
        'x-component': 'Select',
        'x-component-props': {
          defaultValue: '20',
        },
      },
      // similarSearch: {
      //   // 相似搜索
      //   type: 'boolean',
      //   'x-decorator': 'FormItem',
      //   'x-component': 'Switch',
      //   platform: 'web',
      // },

      // 显示返回
      showBack: {
        type: 'boolean',
        'x-decorator': 'FormItem',
        'x-component': 'Switch',
        platform: 'web',
      },
      // searchEngineComponent: {
      //   // 搜索入口组件
      //   type: 'string',
      //   'x-decorator': 'FormItem',
      //   'x-component': 'SelectComponent',
      //   'x-component-props': {
      //     range: 'all',
      //     label: 'title',
      //     filter: 'SearchEngine',
      //   },
      //   'x-reactions': {
      //     dependencies: ['.similarSearch'],
      //     fulfill: {
      //       schema: {
      //         'x-visible': '{{$deps[0]}}',
      //       },
      //     },
      //   },
      //   platform: 'web',
      // },
      displayRule: {
        type: 'string',
        enum: ['1', '2'],
        default: '2',
        'x-decorator': 'FormItem',
        'x-component': 'Select',
      },
      indexIibraryConfig: {
        type: 'array',
        'x-decorator': 'FormItem',
        'x-component': indexIibraryConfig,
      },
    }),
  },
  style: {
    ...createComponentStyleSchema({
      ...createBizStyleSchema({}, {}),
    }),
    ...createDecoratorStyleSchema(),
  },
  controller: createControllerSchema({
    events: [
      {
        name: "onSelectClear",
        label: "重载数据",
      },
      {
        name: "onClick",
        label: "内容区点击",
      },
      {
        name: "onSelect",
        label: "选中数据",
      },
      {
        name: "onSearchParams",
        label: "格式化搜索数据请求参数",
        isConfigEvent: true,
      },
      {
        name: "onSearch",
        label: "自定义搜索数据请求接口",
        isConfigEvent: true,
        platform: 'web'
      },
      {
        name: "onSearchData",
        label: "格式化搜索结果数据",
        isConfigEvent: true,
      },
      {
        name: "onSystemTypeParams",
        label: "格式化系统分类请求参数",
        isConfigEvent: true,
      },
      {
        name: "onSystemType",
        label: "自定义系统分类请求接口",
        isConfigEvent: true,
        platform: 'web'
      },
      {
        name: "onSystemTypeData",
        label: "格式化系统分类数据",
        isConfigEvent: true,
      },
      {
        name: "onSynonymWordParams",
        label: "格式化搜索相似请求参数",
        isConfigEvent: true,
      },
      {
        name: "onSynonymWord",
        label: "自定义搜索相似请求接口",
        isConfigEvent: true,
        platform: 'web'
      },
      {
        name: "onSynonymWordData",
        label: "格式化搜索相似数据",
        isConfigEvent: true,
      },
      {
        name: "onRenderItem",
        label: "自定义渲染项",
        isConfigEvent: true,
      },
    ]
  })
});

const pluginSchema = createInbizSchema({
  attribute: createEmptySchema({
    direction: {
      type: 'string',
      enum: ['column', 'row'],
      'x-decorator': 'FormItem',
      'x-component': 'Radio.Group',
      'x-component-props': {
        defaultValue: 'row',
        optionType: 'button',
      },
    },
    align: {
      type: 'string',
      enum: ['flex-start', 'flex-end', 'center'],
      'x-decorator': 'FormItem',
      'x-component': 'Select',
      'x-component-props': {
        defaultValue: 'flex-start',
      },
    },
  }) as any,
  style: {
    ...createComponentStyleSchema({}),
    ...createDecoratorStyleSchema(),
  },
});

export const Behavior = createBehavior(
  {
    name: 'SearchResultEngine',
    extends: ['Field'],
    selector: (node) => node.props?.['x-component'] === 'SearchResultEngine',
    designerLocales: LocaleSearchResultEngine,
    designerProps: { propsSchema },
  },
  {
    name: 'SearchResultEngine.Plugin',
    extends: ['Field'],
    selector: (node) => node.props?.['x-component'] === 'SearchResultEngine.Plugin',
    designerProps: {
      cloneable: false,
      deletable: false,
      draggable: false,
      droppable: true,
      propsSchema: pluginSchema,
    },
    designerLocales: pluginLocale,
  },
  {
    name: 'SearchResultEngine.RightPlugin',
    extends: ['Field'],
    selector: (node) => node.props?.['x-component'] === 'SearchResultEngine.RightPlugin',
    designerProps: {
      cloneable: false,
      deletable: false,
      draggable: false,
      droppable: true,
      propsSchema: pluginSchema,
    },
    designerLocales: pluginLocale,
  },
  {
    name: 'SearchResultEngine.CenterPlugin',
    extends: ['Field'],
    selector: (node) => node.props?.['x-component'] === 'SearchResultEngine.CenterPlugin',
    designerProps: {
      cloneable: false,
      deletable: false,
      draggable: false,
      droppable: true,
      propsSchema: pluginSchema,
    },
    designerLocales: pluginLocale,
  },
);

export const Resource = createResource({
  icon: 'SearchRes',
  elements: [
    {
      componentName: 'Field',
      props: {
        type: 'void',
        title: {
          value: 'SearchResultEngine.title',
          status: true,
        },
        'x-component': 'SearchResultEngine',
        'x-component-props': defaultProps,
        'x-decorator': 'Container',
        'x-decorator-props': {
          clickable: true
        },
      },
      children: [
        // {
        //   componentName: 'Field',
        //   props: {
        //     type: 'void',
        //     'x-component': 'SearchResultEngine.RightPlugin',
        //     // 'x-decorator': 'Container',
        //   },
        // }
      ],
    },
  ],
});
